.scroll{
    transition: all 0.8s ease-in-out;
    .hide{
        transform: translateX(-200px);
    }
}
#main{
    &:extend(.scroll);
    width: 200px;
}


// all 关键字全局替换
.zks:extend(.warp all){
  
}

.warp{
    width: 300px;
}

.warp{
    &::after{
        content: 'asda';
    }
}